<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>碳达人</title>

    <link rel="stylesheet" th:href="@{/libs/bootstrapvalidator/css/bootstrapValidator.min.css}"/>
    <link rel="stylesheet" th:href="@{/libs/fireui/accordion.css}"/>
    <link rel="stylesheet" th:href="@{/libs/fireui/table.css}"/>
    <link rel="stylesheet" th:href="@{/cweb/css/calculator.css}"/>
    <link rel="stylesheet" th:href="@{/cweb/css/customer-20211209.css}"/>
</head>
<body>
<header id="header">
    <div th:replace="home/cfragments/navbar :: cnavbar"></div>
</header>
<span th:if="${CURRENT_CUSTOMER == null}">
    <span id="no_login"></span>
</span>
<div class="main-container">
    <div class="content">
        <form class="form-horizontal" id="coalTypeForm">
            <div class="calc_two_main" style="min-height: 830px;border-left:  1px solid #C7C7C7;">
                <div class="calc_two_content calc_two_main_left"
                     style="min-height: 830px;border-right: 1px solid #C7C7C7;border-left: 0;width: 45%">
                    <div id="accordionThree" role="tablist" class="fire_accordion_common fire_accordion1">
                        <div class="card" style="height: 374px">
                            <a data-toggle="collapse" class="title" href="#collapseThree" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>E<sub>燃烧</sub>：燃料燃烧二氧化碳排放量，单位为t
                            </a>
                            <div id="collapseThree" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>NCV<sub>i</sub>：第i种化石燃料的平均低位发热量，对固体和液体燃料以GJ/t为单位，对气体燃料以GJ/10<sup>4</sup>Nm<sup>3</sup>为单位
                                    </br>FC<sub>i</sub>：第i种化石燃料的净消耗量，对固体和液体燃料以t为单位，对气体燃料以10<sup>4</sup>Nm<sup>3</sup>为单位
                                    </br>CC<sub>i</sub>：第i种化石燃料的单位热值含碳量，单位为t/GJ
                                    </br>OF<sub>i</sub>：第i种化石燃料的碳氧化率，单位为%
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 1126px">
                            <a data-toggle="collapse" class="title" href="#collapse1" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>E<sub>CH4_逃逸</sub>：甲烷逃逸排放量，单位为t
                            </a>
                            <div id="collaps1" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>AD<sub>井工，i</sub>：矿井i当年的原煤产量，单位为t
                                    </br>q<sub>相CH4，i</sub>：矿井i当年的相对瓦斯涌出量，单位为m<sup>3</sup>/t
                                    </br>AD<sub>露天，i</sub>：露天煤矿i当年的原煤产量，单位为t
                                    </br>AD<sub>矿后，i</sub>：瓦斯等级为i的所有矿井的原煤产量之和，单位为t
                                    </br>EF<sub>矿后，i</sub>：瓦斯等级为i的矿井的矿后活动甲烷排放因子，单位为m<sup>3</sup>/t
                                    </br>Q<sub>瓦斯_火炬/催化氧化</sub>：煤层气（煤矿瓦斯）的火炬燃烧量及催化氧化量之和，单位为10<sup>4</sup>Nm<sup>3</sup>
                                    </br>φ<sub>CH4_火炬</sub>：用于火炬燃烧或催化氧化的煤层气（煤矿瓦斯）中甲烷的平均体积分数，单位为%
                                    </br>Q<sub>瓦斯_利用</sub>：煤层气（煤矿瓦斯）回收利用量，包括回收自用和回收外供的量（火炬燃烧和催化氧化除外），单位为10<sup>4</sup>Nm<sup>3</sup>
                                    </br>φ<sub>CH4_利用</sub>：回收利用的煤层气（煤矿瓦斯）中甲烷的平均体积分数，单位为10<sup>4</sup>Nm<sup>3</sup>
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 527px">
                            <a data-toggle="collapse" class="title" href="#collapse3" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>E<sub>CO2_逃逸</sub>：二氧化碳逃逸排放量，单位为t
                            </a>
                            <div id="collapse3" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>AD<sub>井工，i</sub>：矿井i当年的原煤产量，单位为t
                                    </br>q<sub>相CO2，i</sub>：矿井i当年的相对二氧化碳涌出量，单位为m<sup>3</sup>/t
                                    </br>CN<sub>n</sub>：煤层气（煤矿瓦斯）中组分n化学分子式中碳原子的数目
                                    </br>φ<sub>n</sub>：组分n的体积分数，单位为%
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 375px">
                            <div id="collapse4" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>AD<sub>购入电</sub>：年度内的外购电力，单位为MWh
                                    </br>EF<sub>购入电</sub>：区域电网年平均供电因子，单位为t/MWh
                                    </br>AD<sub>购入热</sub>：年度内的外购热力，单位为GJ
                                    </br>AD<sub>输出电</sub>：年度内的输出电量，单位为MWh
                                    </br>EF<sub>输出电</sub>：年度内的输出电量，单位为MWh
                                    </br>AD<sub>输出热</sub>：年度内的输出热力，单位为GJ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="calc_two_content calc_two_main_right" style="min-height: 830px;border-left: 0;width: 55%">
                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="eBurn" readonly id="eBurn"
                                       placeholder="燃料燃烧二氧化碳排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addEBurn()">添加
                                        </button>
                                    </th>
                                    <th style="width: 20%">NCV<sub>i</sub></th>
                                    <th style="width: 20%">FC<sub>i</sub></th>
                                    <th style="width: 20%">CC<sub>i</sub></th>
                                    <th style="width: 30%">OF<sub>i</sub></th>
                                </tr>
                                </thead>
                                <tbody id="eBurnTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="ech4" readonly id="ech4"
                                       placeholder="甲烷逃逸排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addEch4()">添加
                                        </button>
                                    </th>
                                    <th style="width: 45%">AD<sub>井工，i</sub></th>
                                    <th style="width: 45%">q<sub>相CH4，i</sub></th>
                                </tr>
                                </thead>
                                <tbody id="ech4Tbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addOpenAir()">添加
                                        </button>
                                    </th>
                                    <th style="width: 90%">AD<sub>露天，i</sub></th>
                                </tr>
                                </thead>
                                <tbody id="openAirTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addPostMine()">添加
                                        </button>
                                    </th>
                                    <th style="width: 45%">AD<sub>矿后，i</sub></th>
                                    <th style="width: 45%">EF<sub>矿后，i</sub></th>
                                </tr>
                                </thead>
                                <tbody id="postMineTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_center calc_two_main_right_content" style="border-bottom: 1px solid #C7C7C7;">
                        <div class="form-group">
                            <label for="qGasTorch" class="col-sm-3 control-label"
                                   style="font-size: 17px">Q<sub>瓦斯_火炬/催化氧化</sub></label>
                            <div class="col-sm-3">
                                <input type="text" class="form-control" name="qGasTorch"
                                       id="qGasTorch">
                            </div>
                            <label for="methaneCh4Torch" class="col-sm-2 control-label"
                                   style="font-size: 17px">φ<sub>CH4_火炬</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="methaneCh4Torch"
                                       id="methaneCh4Torch">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="qGasUtilize" class="col-sm-3 control-label"
                                   style="font-size: 17px">Q<sub>瓦斯_利用</sub></label>
                            <div class="col-sm-3">
                                <input type="text" class="form-control" name="qGasUtilize"
                                       id="qGasUtilize">
                            </div>
                            <label for="methaneCh4Utilize" class="col-sm-2 control-label"
                                   style="font-size: 17px">φ<sub>CH4_利用</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="methaneCh4Utilize"
                                       id="methaneCh4Utilize">
                            </div>
                        </div>
                    </div>
                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="eco2" readonly id="eco2"
                                       placeholder="二氧化碳逃逸排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addEco2()">添加
                                        </button>
                                    </th>
                                    <th style="width: 20%">AD<sub>井工，i</sub></th>
                                    <th style="width: 20%">q<sub>相CO2，i</sub></th>
                                    <th style="width: 20%">CN<sub>n</sub></th>
                                    <th style="width: 30%">φ<sub>n</sub></th>
                                </tr>
                                </thead>
                                <tbody id="eco2Tbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_center calc_two_main_right_content">
                        <div class="form-group">
                            <label for="adPurchaseElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>购入电</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adPurchaseElectric"
                                       id="adPurchaseElectric">
                            </div>
                            <label for="efPurchaseElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">EF<sub>购入电</sub></label>
                            <div class="col-sm-4">
                                <select class="form-control" name="efPurchaseElectric" id="efPurchaseElectric">
                                    <option value="0">请选择</option>
                                    <option value="0.9419">0.9419(华北电网)</option>
                                    <option value="1.0826">1.0826(东北电网)</option>
                                    <option value="0.7921">0.7921(华东电网)</option>
                                    <option value="0.8587">0.8587(华中电网)</option>
                                    <option value="0.8922">0.8922(西北电网)</option>
                                    <option value="0.8042">0.8042(南方电网)</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="adOutInputElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>输出电</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adOutInputElectric"
                                       id="adOutInputElectric">
                            </div>
                            <label for="efOutInputElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">EF<sub>输出电</sub></label>
                            <div class="col-sm-4">
                                <select class="form-control" name="efOutInputElectric" id="efOutInputElectric">
                                    <option value="0">请选择</option>
                                    <option value="0.9419">0.9419(华北电网)</option>
                                    <option value="1.0826">1.0826(东北电网)</option>
                                    <option value="0.7921">0.7921(华东电网)</option>
                                    <option value="0.8587">0.8587(华中电网)</option>
                                    <option value="0.8922">0.8922(西北电网)</option>
                                    <option value="0.8042">0.8042(南方电网)</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="adPurchaseHeat" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>购入热</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adPurchaseHeat" id="adPurchaseHeat">
                            </div>
                            <label for="adOutInputHeat" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>输出热</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adOutInputHeat" id="adOutInputHeat">
                            </div>
                        </div>
                    </div>
                    <div style="width: 100%; float: left">
                        <div class="calc_line"></div>
                    </div>
                    <div class="calc_bottom calc_two_main_right_content">
                        <button class="btn btn-info waves-effect waves-light btn-sm" style="float: left"
                                onclick="getCoal()"
                                type="button">计算
                        </button>
                        <div id="result"></div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<div>
    <div th:replace="home/cfragments/float_right :: cfloatright"></div>
</div>
<div class="footer">
    <div th:replace="home/cfragments/footer :: cfooter"></div>
</div>
<script th:src="@{/libs/bootstrap/bootstrap.min.js}"></script>
<script th:src="@{/libs/bootstrapvalidator/js/bootstrapValidator.js}"></script>
<script>

    $(function () {
        $('#tdr').addClass('th-bg');
        if ($('#no_login').length == 1) {
            userLogin();
        }
        initValidator();
    });

    function resetValidator() {
        $("#coalTypeForm").data('bootstrapValidator').destroy();
        $('#coalTypeForm').data('bootstrapValidator', null);
        initValidator();
    }

    function initValidator() {
        $('#coalTypeForm').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                qGasTorch: {
                    message: 'Q<sub>瓦斯_火炬/催化氧化</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入Q<sub>瓦斯_火炬/催化氧化</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                qGasUtilize: {
                    message: 'Q<sub>瓦斯_利用</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入Q<sub>瓦斯_利用</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                methaneCh4Torch: {
                    message: 'φ<sub>CH4_火炬</sub>验证失败',
                    validators: {
                        callback: xz0_1_validator
                    }
                },
                methaneCh4Utilize: {
                    message: 'φ<sub>CH4_利用</sub>验证失败',
                    validators: {
                        callback: xz0_1_validator
                    }
                },
                adPurchaseElectric: {
                    message: 'AD<sub>购入电</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>购入电</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{3}$/,
                            message: '只能输入保留三位小数的数字'
                        }
                    }
                },
                adOutInputElectric: {
                    message: 'AD<sub>输出电</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>输出电</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{3}$/,
                            message: '只能输入保留三位小数的数字'
                        }
                    }
                },
                adPurchaseHeat: {
                    message: 'AD<sub>购入热</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>购入热</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                adOutInputHeat: {
                    message: 'AD<sub>输出热</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>输出热</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                methanens: {
                    message: 'φ<sub>n</sub>验证失败',
                    validators: {
                        callback: xz0_1_validator
                    }
                }
            }
        });
    }

    function addEBurn() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="ncv" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td2 = '<td><input type="text" class="form-control" name="fc" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td3 = '<td><input type="text" class="form-control" name="cc" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var ofTd = '<td colspan="1">' +
                '<select class="form-control" name="of">' +
                '<option value="0">请选择</option>' +
                '<option value="0.90">0.90(型煤或其他洗煤)</option>' +
                '<option value="0.93">0.93(焦炭、烟煤、洗精煤)</option>' +
                '<option value="0.94">0.94(无烟煤)</option>' +
                '<option value="0.98">0.96(褐煤)</option>' +
                '<option value="0.98">0.98(液体燃料)</option>' +
                '<option value="0.99">0.99(气体燃料)</option>' +
                '</select></td>';
        $('#eBurnTbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '' + td3 + '' + ofTd + '</tr>');
    }

    function addEch4() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="adWellWorker" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td2 = '<td><input type="text" class="form-control" name="qch4" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        $('#ech4Tbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '</tr>');
    }

    function addPostMine() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="adPostMine" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td2 = '<td colspan="1">' +
                '<select class="form-control" name="efPostMine">' +
                '<option value="0">请选择</option>' +
                '<option value="3">3(突出矿井)</option>' +
                '<option value="3">3(高瓦斯矿井)</option>' +
                '<option value="0.94">0.94(瓦斯矿井)</option>' +
                '</select></td>';
        $('#postMineTbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '</tr>');
    }

    function addOpenAir() {
        let delTd = '<td></td>';
        let td1 = '<td><input type="text" class="form-control" name="adOpenAir" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        $('#openAirTbody').append('<tr>' + delTd + '' + td1 + '</tr>');
    }

    function addEco2() {
        let delTd = '<td></td>';
        let td1 = '<td><input type="text" class="form-control" name="adWellWorkers" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        let td2 = '<td><input type="text" class="form-control" name="qco2s" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        let td3 = '<td><input type="text" class="form-control" name="cnns" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        let td4 = '<td><div class="form-group"><input type="text" class="form-control" name="methanens"></div></td>';
        $('#eco2Tbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '' + td3 + '' + td4 + '</tr>');
        resetValidator();
    }

    function getCoal() {
        let fv = $('#coalTypeForm').data('bootstrapValidator');
        fv.validate();
        let flag = fv.isValid();
        if (flag) {
            Core.postAjax("/blog/coal/api/result", $('#coalTypeForm').serialize(), function (data) {
                console.info(data)
                $('#result').html(data.data.result)
                $('#eBurn').val(data.data.eburn);
                $('#ech4').val(data.data.ech4);
                $('#eco2').val(data.data.eco2);
            });
        }
    }

</script>
</body>
</html>